<template>
  <div id="app">
    <!-- 5 路由出口 -->
    <router-view></router-view>

    <!-- 6. 路由导航  -->
    <p>
      <router-link to="/home">首页</router-link>
      <router-link to="/find">发现</router-link>
      <router-link to="/demo">案例</router-link>
      <router-link to="/mine">个人中心</router-link>
      <span> count = {{  count  }}</span>
    </p>
  </div>
</template>

<script>
import { mapState } from 'vuex'
export default {
  computed:{
    // count(){
    //   return this.$store.state.count
    // }
    ...mapState(['count'])
  }
}
</script>

<style scoped>
     .router-link-exact-active , .router-link-active{
            color:brown;
            font-size: 30px;
            font-weight: 800;
        }
</style>
